<template>
	<div>
		<div class="nav">
			<router-link to="/layout/wode">
				<img src="../../assets/smallIcon/return.png"  alt="" >
			</router-link>
			设置
		</div>
		<div class="gl">
			<span>账号管理</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="aq">
			<span>账号与安全</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="xiaoxi">
			<span>消息设置</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="pb">
			<span>屏蔽设置</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="tongyong">
			<span>通用设置</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="kefu">
			<span>客服中心</span>
			<img class="next" src="../../assets/smallIcon/get into.png" alt="">
			<img class="new" src="../../assets/smallIcon/new.png" alt="">
			
		</div>
		<div class="lushang">
			<span>关于路上</span>
			<img class="new" src="../../assets/smallIcon/find the new edition.png" alt="">
		</div>
		<div class="hc">
			<span>清除缓存</span>
			<span class="num">439.8MB</span>
			<img class="new" src="../../assets/smallIcon/get into.png" alt="">
		</div>
		<div class="huyan">
			<span>护眼模式</span>
			<img class="new" src="../../assets/smallIcon/open.png" alt="">
		</div>
		<div class="tuijian">
			<span>推荐我们</span>
			<img src="../../assets/smallIcon/get into.png" alt="" class="right">
		</div>
		<div class="tuichu" @click="delcookie">
			退出登录
		</div>
		<FooterNav/>
	</div>
</template>
<script>
import FooterNav from '../../components/footerNav'
	export default{
		name:"setting",
		data(){
			return{

			}
		},
		components:{
			FooterNav
		},
		methods:{
			delcookie(){
				this.$cookie.delete('username');
				window.location.href="/#/layout";
			}
		}
	}
</script>
<style scoped lang="less">
.nav{
	width:100%;
	height:94 / 50rem;
	background-color: #7DD19C;
	box-sizing:border-box;
	font-size: 36 / 50rem;
	position: fixed;
	top:0;
	left:0;
	right:0;
	z-index: 666;
	text-align: center;
	line-height: 94 /50rem;
}
.nav img{
	width:22 / 50rem;
	height:40 / 50rem;
	position: absolute;
	left: 20 /50rem;
	margin-top: 30 / 50rem;
	float: left;
}
.gl{
	background-color: #ffffff;
	margin-top: 114 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.gl span{
	font-size: 28 / 50rem;
}
.gl img{
	width:22 / 50rem;
	height:40 / 50rem;
}
.aq{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.aq span{
	font-size: 28 / 50rem;
}
.aq img{
	width:22 / 50rem;
	height:40 / 50rem;
}

.xiaoxi{
	background-color: #ffffff;
	margin-top: 20 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.xiaoxi span{
	font-size: 28 / 50rem;
}
.xiaoxi img{
	width:22 / 50rem;
	height:40 / 50rem;
}

.pb{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.pb span{
	font-size: 28 / 50rem;
}
.pb img{
	width:22 / 50rem;
	height:40 / 50rem;
}

.tongyong{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.tongyong span{
	font-size: 28 / 50rem;
}
.tongyong img{
	width:22 / 50rem;
	height:40 / 50rem;
}

.kefu{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.kefu span{
	font-size: 28 / 50rem;
}
.kefu .next{
	width:22 / 50rem;
	height:40 / 50rem;
	float: right;
}
.kefu .new{
	width:70 / 50rem;
	height:36 / 50rem;
	margin-right: 30 / 50rem;
	float: right;
}


.lushang{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.lushang span{
	font-size: 28 / 50rem;
}
.lushang img{
	width:135 / 50rem;
	height:36 / 50rem;
	float: right;
}

.hc{
	background-color: #ffffff;
	margin-top: 20 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.hc .num{
	font-size: 20 / 50rem;
	margin-left: 400 / 50rem;
	margin-right: 40 / 50rem;
}
.hc span{
	font-size: 28 / 50rem;
	//margin-right: 400 / 50rem;
}
.hc img{
	width:22 / 50rem;
	height:40 / 50rem;
	float: right;
}

.huyan{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem  20 / 50rem;
	position: relative;
}
.huyan span{
	font-size: 28 / 50rem;
}
.huyan img{
	width:100 / 50rem;
	height:60 / 50rem;
	right: 20 /50rem;
	position: absolute;
	bottom: 10 /50rem;
}

.tuijian{
	background-color: #ffffff;
	margin-top: 1 / 50rem;
	padding: 27 / 50rem 20 / 50rem;
}
.tuijian span{
	font-size: 28 / 50rem;
}
.tuijian img{
	width:22 / 50rem;
	height:40 / 50rem;
}

.tuichu{
	background-color: #ffffff;
	font-size: 28 / 50rem;
	color:#7dd19c;
	padding: 28 / 50rem 315 / 50rem;
	margin-top: 20 / 50rem;
	margin-bottom: 121 / 50rem;
}
.right{
	float: right;
}
</style>